<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>{$Think.session.user.p_u_id|get_web_f_mesage}</title>
  <link rel="stylesheet" href="__PUBLIC__/script/jquery-weui/dist/lib/weui.min.css">
  <link rel="stylesheet" href="__PUBLIC__/script/jquery-weui/dist/css/jquery-weui.min.css">
  <link rel="stylesheet" href="__PUBLIC__/styles/base.css">
  <link rel="stylesheet" href="__PUBLIC__/styles/next_pingu.css">
  <script src="https://cdn.jsdelivr.net/npm/babel-polyfill/dist/polyfill.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/jquery"></script>
  <script src="__PUBLIC__/script/pub/qudao_type.js"></script>
  <script src="__PUBLIC__/script/pub/chanpin_type.js"></script>
  <style>
    .weui_cells .tag_title { font-size: 1.2rem;line-height:2.4rem;text-indent:1rem; }
    .tag_wrap {padding:0 .5rem;}
    .tag_container { flex-basis:25%; }
  </style>
</head>
<body>
  <div class="hidden_form">
    <form autocomplete="off" action="{:U('WebUser/last_product')}" method="post" id = 'hidden_form_1'></form>
  </div>
  <div class="container">
    <div class="header">{$Think.session.user.p_u_id|get_web_f_mesage}</div>

    <div class="message_box">
      <div style='height:2vh;'></div>
      <volist name='biaoqian' id='vo'>
      <div class="weui_cells">
        <div class="tag_title weui_cell">{$vo.dtypename|qudao_type} - <volist name='vo.cp_temp' id='vv'>{$vv.name} &nbsp; </volist></div>
        <hr style="border:none;background-color:#ccc;width:95%;margin:0 auto;margin-bottom:1rem;height:1px;">
        <div class="tag_wrap weui_cell">
          <volist name='vo.jinjian' id='val'>
          <div class="tag_container">
            <input form='hidden_form_1' value='{$val.id}' type="checkbox" name="chanpin_type_1[]" id="chanpin_type_{$vo.dtypename}_{$vv.id}_{$val.id}" class="check_tag">
            <label for="chanpin_type_{$vo.dtypename}_{$vv.id}_{$val.id}" class="label_check_tag"><span><span>{$val.name}</span></span></label>
          </div>
          </volist>
        </div>
      </div>
      </volist>

    </div>

    <div style="height:5vh;width:100%;"></div>

    <div class="weui-flex button_container">
      <div class="weui-flex__item open-popup" data-target="#shenhe_popup"><a href="javascript:void(0);" class="weui-btn weui-btn_primary">完成评估</a></div>
      <div class="weui-flex__item"><a href="javascript:void(0);" class="weui-btn weui-btn_warn" onclick="fall_back(this, event)">返回</a></div>
    </div>
  </div>
  <div style="height:5vh;width:100%;"></div>
  <div id="shenhe_popup" class="weui-popup__container">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
      <h1 class="title close-popup">选择协助你的按揭员</h1>
      <div class="weui-grids">
        <volist name='web_user_list' id='web_user'>
        <div href="javascript:void(0)" onclick="postThis(this, event)" class="weui-grid js_grid" inori-data='{$web_user.web_id}'>
          <div class="weui-grid__icon">
            <if condition="$web_user['web_img']"><img src="{$web_user['web_img']}" alt="u900"><else /><img src="__PUBLIC__/res/u900.png" alt="u900"></if>
          </div>
          <div class="weui-grid__label">
            {$web_user.web_name}
            <div class="tel_box"><a href="tel:{$web_user.web_phone};">{$web_user.web_phone}</a></div>
          </div>
        </div>
        </volist>
      </div>
    </div>
  </div>
  <script src="__PUBLIC__/script/common.js" common-data-1="{:U('Mix/dest')}"></script>
  <script src="__PUBLIC__/script/jquery-weui/dist/js/jquery-weui.min.js"></script>
  <script src="__PUBLIC__/script/jquery-weui/dist/js/city-picker.min.js"></script>
  <script>
    function postThis (_this, evt) {
      if (String(evt.target).indexOf('tel:') === -1) {
        let shen_name = $(evt.target).closest('.js_grid').attr('inori-data')
        const tempInput = `<input type="radio" name="shen_name" value='${shen_name}' form='hidden_form_1'>`
        sessionStorage.setItem('shenheName', `${shen_name}`)
        $('#hidden_form_1').append(tempInput)
        /* 储存本页数据 */
        let wholeFormValue = sessionStorage.getItem('rawFormData')
        wholeFormValue = JSON.parse(wholeFormValue)
        let sessionValue = $('#hidden_form_1').serializeArray()
        /* 去重 */
        let tempUniArray = []
        for(let item of sessionValue) {
          if(!tempUniArray.find(i => i.name === item.name && i.value === item.value)) {
            tempUniArray.push(item)
          } else {
            // $(`[name='${item.name}'][value='${item.value}']`).each((index, item) => {if(index !== 1){$(item).remove()}})
          }
        }
        sessionValue = tempUniArray
        /* end 去重 */
        wholeFormValue = wholeFormValue.concat(sessionValue)
        sessionStorage.setItem('rawFormData', JSON.stringify(wholeFormValue))
        sessionStorage.setItem('rawFormData_3', JSON.stringify(sessionValue))
        // 构造选择后的id值
        let tempInputID = []
        $('input:checked').each((index, item) => {
          const tempID = $(item).attr('id')
          if (tempID === undefined || tempID === '') {
            ;
          } else {
            tempInputID.push(tempID)
          }
        })
        sessionStorage.setItem('rawFormData_3_id', tempInputID.join(','))
        /* end 储存本页数据 */
        // throw new Error('debugging')
        let formName = genNewForm()
        sessionStorage.setItem('nextPingu', JSON.stringify($(`#${formName}`).serializeArray()))
        $.closePopup()
        // 即将提交提示
        $.toptip('即将提交输入信息，请稍后', 'success')
        setTimeout(function(){
          $(`#${formName}`).submit()
        }, 0)
      }
    }
    $('.weui-popup__modal').on('click', function (evt) {
      if ($(evt.target).hasClass('weui-popup__modal')) {
        $.closePopup()
      }
    })
  </script>
  <script id="fallBackScript">
    /* 返回上一页 */
    function fall_back (_this, evt) {
      location.href=`{:U('WebUser/new_pingu')}`
    }
  </script>
  <!-- 联动选择
  <script>
    $(document).ready(() => {
      $('body').on('click', (event) => {
        if (event.target.nodeName.toLowerCase() === 'label' && $(event.target).attr('for') !== undefined) {
          let id = $(event.target).attr('for')
          $(`#${id}`).each(() => {
            $(this).prop('checked', true)
          })
        }
      })
    })
  </script> -->
  <!-- 回填 -->
  <script>
    $(document).ready(() => {

      let myValue = sessionStorage.getItem('rawFormData_3_id')
      if (myValue !== undefined && myValue !== null && myValue !== '[]') {
        try{
          myValue = myValue.split(',')
          for( let item of myValue ) {
            $(`#${item}`).prop('checked', true)
          }
          /* 先固定raw数据，防止重复添加 */
          let rawValue = JSON.parse(sessionStorage.getItem('rawFormData_1')).concat(JSON.parse(sessionStorage.getItem('rawFormData_2')))
          sessionStorage.setItem('rawFormData', JSON.stringify(rawValue))
        } catch (e) {
          $('input').each((index, item)=>{$(item).val(null); $(item).prop('checked', false)})
          // alert('数据回填异常，请重新填写一遍数据')
          throw e
        }
      }
    })
  </script>
  <!-- 根据后端要求构建数据 -->
  <script>
    // 取出所有数据拼到4
    function genNewForm () {
      /* gen出来的form的ID，下边都要引用 */
      const formID = `genForm`
      /* 上一个页面提交的结构，这里是因为想少做一次生成，后端要求的数据结构跟表单的直接结构有点区别 */
      let PreViewForm = sessionStorage.getItem('newPingu')
      /* 本页面将要拼在gen出来的Form的表单项 */
      let tempFormItem = ``
      /* gen出来的表单 */
      let tempForm = `<form autocomplete="off" action="{:U('WebUser/last_product')}" method="post" id = '${formID}'></form>`
      /* 本页面原本的数据，要求被处理成数值后去重 */
      let rawFormValue = $('#hidden_form_1').serializeArray()
      /* 转成只有value的数组 */
      rawFormValue = Array.from(rawFormValue).map(item => item.value)
      /* 去重变字符串 */
      rawFormValue = [...new Set(rawFormValue)].join(',')
      $('body').append(tempForm)
      try {
        PreViewForm = JSON.parse(PreViewForm)
      } catch (e) {
        console.log(e)
        PreViewForm = null
      }
      if (PreViewForm !== null) {
        for(let item of PreViewForm) {
          tempFormItem += `<input type='hidden' name='${item.name}' value='${item.value}'>`
        }
      }
      tempFormItem += `<input type='hidden' name='4' value='${rawFormValue}'>`
      $(`#${formID}`).append(tempFormItem)
      return formID
    }
  </script>
</body>
</html>